import React from 'react'
import { createRoot } from 'react-dom/client'
import ReactDom from 'react-dom'
import store from './store'
import { add, minus } from './store/action'

function App() {
  return (
    <div>
      <div>我是App组件---{store.getState()}</div>
      <button
        onClick={() => {
          store.dispatch(add())
        }}
      >
        +1
      </button>
      <button
        onClick={() => {
          store.dispatch(minus())
        }}
      >
        -1
      </button>
    </div>
  )
}
/* 

import { createRoot } from 'react-dom/client';
const container = document.getElementById('root');
const root = createRoot(container);
root.render(<App />)
*/
createRoot(document.getElementById('root')).render(<App />)
// ReactDom.render(<App></App>, document.getElementById('root'))
store.subscribe(() => {
  createRoot(document.getElementById('root')).render(<App />)
})
